<template>
  <section class="brand">
      <vheader title="品牌馆"
      showleft="true"
      @faleft="clickLeft">
      </vheader>
      <ul class="brand-main">
        <li class="brand-main-item" v-for="(item,index) in brands" :key="index">
          <img :src="item" alt="">
          <vbar/>
        </li>
      </ul>
      <vfoot></vfoot>
  </section>
</template>
<script>
import header from "../../components/header/header";
import foot from "../../components/foot/foot";
import bar from "../../components/bar/bar";
export default {
  name:'brand',
  data(){
    return {
      brands :[
        require("./brand1.jpg"),
        require("./brand2.jpg"),
        require("./brand3.jpg"),
        require("./brand4.jpg")
      ]
    }
  },
  components:{
    vheader:header,
    vbar:bar,
    vfoot:foot
  },
  methods:{
   clickLeft(){
      this.$router.go(-1);
    }
  }
};
</script>
<style lang="scss">
@import "../../assets/scss/_index.scss";
.brand-main{
  width: 100%;
  &-item{
    width: 100%;
    img{
      width: 100%;
    }
  }
}
</style>